<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <title>imageThinking</title>
    <link href="../../../static/css/bootstrap.css" type="text/css" media="screen" rel="stylesheet"/>
    <link href="../../../static/css/bootstrap-xadmin.css" type="text/css" media="screen" rel="stylesheet"/>
    <link href="../../../static/css/set-meal.css" type="text/css" media="screen" rel="stylesheet"/>
    <script type="text/javascript" src="../../../static/js/jquery.js"></script>

<style type="text/css">
        body.dashboard {
            background-color: #FBFBFB;
            /*font-family: "-apple-system-font,Helvetica Neue,PingFang SC,Microsoft YaHei,sans-serif";*/
            font-family: 400 1em/1.8 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', STHeiti, 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
        }

        ul, li {
            list-style: none;
        }

        a {
            color: #606266;
            display: block;
            text-decoration: none !important;
        }

        a:hover, a:focus {
            /*color: #428bca;*/
            color: #606266;
        }

        hr {
            margin: 20px 0px 10px;
        }

        input {
            outline：none !important;
            padding: 0;
        }

        input:hover, input:focus {
            outline：none !important;
            border: none;
        }

        .padding-left05 {
            margin-left: 10px;
        }

        .mian-width {
            width: 1300px;
            margin: 0 auto;
        }

        .fs12 {
            font-size: 12px;
        }

        .fs14 {
            font-size: 14px;
        }

        .fs16 {
            font-size: 16px;
        }

        .fw700 {
            font-weight: 700;
        }

        .c3 {
            color: #606266;
        }

        .navbar-brand {
            padding: 7px 0;
        }

        .navbar {
            margin-bottom: 0;
        }

        .navbar-collapse {
            padding-left: 0px;
            padding-right: 0px;
        }

        .btn-login {
            border: 1px solid #fff;
            margin-right: 18px;
            padding: 5px 0 !important;
            text-align: center;
            color: #fff !important;
            width: 80px;
            font-size: 14px;
            display: inline-block;
            line-height: 1;
            white-space: nowrap;
            cursor: pointer;
            border-color: #dcdfe6;
            -webkit-appearance: none;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            outline: none;
            -webkit-transition: .1s;
            transition: .1s;
            font-weight: 500;
            -moz-user-select: none;
            -webkit-user-select: none;
            -ms-user-select: none;
            border-radius: 4px;
            margin-top: 14px;
        }

        .btn-login:hover {
            background-color: #fff !important;
            color: #525cdc !important;
        }

        .btn-register:hover {
            background-color: #757de3 !important;
            color: #fff !important;
        }

        .btn-register {
            background-color: #525cdc;
            border-color: #525cdc;
        }

        .auth-body-warp {
            display: none;
        }

        .auth-body {
            background-color: rgba(0, 0, 0, 0.8);
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 1030;
            display: flex;
            align-items: center;
        }

        .body-middle {
            width: 100%;
            margin: 0 auto;
        }

        .body-middle form {
            display: flex;
            text-align: center;
            align-items: center;
        }

        .top-img {
            width: 100%;
            text-align: center;
            margin: 0 auto;
        }

        .panel-wrapper {
            width: 100%;
        }

        .panel {
            background-color: #fff;
            width: 440px;
            max-width: 100%;
            border: 1px solid #eee;
            border-radius: 10px;
            z-index: 100;
            padding: 30px 60px;
            margin: 20px auto;
        }

        .body-content {
            width: 1300px;
            margin: 75px auto 0;
        }

        .grabble {
            width: 100%;
        }

        .grabble-left {
            width: 80%;
            float: left;
            position: relative;
        }

        .grabble .grabble-input {
            width: 100%;
            height: 40px;
            padding: 0;
            text-indent: 1em;
            border: 1px solid #dcdfe6;
            border-radius: 5px;
        }

        .grabble-rigth {
            width: 18%;
            float: left;
            margin-left: 17px;
        }

        .grabble-button {
            display: inline-block;
            height: 40px;
            width: 100%;
            color: #fff;
            padding: 0;
            text-align: center;
            line-height: 40px;
            font-size: 16px;
            border-radius: 5px;
        }

        .show-module {
            width: 100%;
            margin-left: -10px;
            position: relative;
        }

        .show-module li.outer-li {
            width: 206px;
            float: left;
            font-size: 14px;
            margin-left: 10px;
            margin-top: 20px;
            text-align: center;
            cursor: pointer;
            border-radius: 5px;
            position: relative;
        }

        .show-module li.outer-li a {
            height: 40px;
            border: 1px solid #dcdfe6;
            line-height: 40px;
            border-radius: 5px;
        }

        .select-a {
            text-align: left;
            text-indent: 0.5em;
            background: url(../../../static/images/cxjt.png) no-repeat scroll 88% center transparent;
            background-size: 15px 8px;
            color: #606266;
        }

        .select-ul {
            position: absolute;
            top: 35px;
            width: 100%;
            margin: 10px auto;
            padding: 0;
            background-color: #fff;
            max-height: 300px;
            border: 1px solid #f5f7fa;
            border-radius: 5px;
            -moz-box-shadow: 2px 2px 13px #919191;
            -webkit-box-shadow: 2px 2px 13px #919191;
            box-shadow: 2px 2px 13px #919191;
            overflow-y: auto;
            z-index: 100;
            display: none;
            color: #606266;
        }

        .select-ul li {
            height: 40px;
            line-height: 40px;
        }

        .select-ul li:hover {
            background-color: #f5f7fa;
        }

        .content-middle-ul {
            width: 100%;
            margin-top: 20px;
        }

        .margin-top0 {
            margin-top: 0;
        }

        .li-titel {
            font-weight: 600;
            font-size: 20px;
        }

        .li-heat {
            text-align: left;
        }

        .close-img {
            float: right;
            width: 30px;
            height: 30px;
            margin-right: -45px;
            margin-top: -10px;
        }

        .user-information {
            overflow: hidden;
            margin: 10px auto 0;
        }

        .user-information img {
            border-radius: 100%;
        }

        .user-color {
            color: #fff;
            text-align: center;
            font-size: 16px;
            line-height: 29px;
            float: right;
        }
        .vip-ico{
            position: relative;
            top: 8px;
            left: -6px;
        }

        .grabble-select {
            width: 85px;
            position: absolute;
            top: 0px;
            min-height: 40px;
            left: 0px;
            background: url(../../../static/images/cxjt.png) no-repeat scroll 88% center transparent;
            background-size: 15px 8px;
            padding: 0;
            border-right: 1px solid #dcdfe6;
        }

        .grabble-select .outer-li {
            position: relative;
            min-height: 40px;
        }

        .grabble-select .outer-li .select-a {
            cursor: pointer;
            height: 40px;
            line-height: 40px;
        }

        .grabble-select .outer-li .select-ul {
            text-align: center;
            z-index: 110;
        }

        .head-content {
            color: #606266;
            margin: 10px auto;
        }

        .new-head-content {
            color: #606266;
            margin: 10px auto 15px;
        }

        .single-page {
            position: absolute;
            width: 315px;
            padding: 15px 15px 0 15px;
            margin: 10px 10px 10px 0;
            border: 1px solid #d4d4d4;
            background-color: #fff;
            border-radius: 5px;
        }

        .mian-img-div {
            width: 100%;
            text-align: center;
            border: 1px solid #ccc;
            margin: 0px auto;
            border-radius: 5px;
            -moz-box-shadow: 2px 2px 15px #c1c1c1;
            -webkit-box-shadow: 2px 2px 15px #c1c1c1;
            box-shadow: 2px 2px 15px #c1c1c1;
        }

        .mian-img {
            width: 96%;
            margin: 5px auto;
        }

        img.head-logo {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            margin: 0px auto;
        }

        .head-content span {
            display: inline-block;
            height: 20px;
            margin-right: 10px;
            font-size: 12px;
        }

        span.span-right {
            cursor: pointer;
            text-align: right;
        }

        .heat-img {
            height: 15px;
            margin-top: -1px;
        }

        .clear {
            clear: both
        }

        a.select-a:hover, a.select-a:focus {
            color: #333;
        }

        .collect-button {
            text-align: right;
        }

        .a-button {
            display: inline-block;
            width: 65px;
            height: 25px;
            border: 1px solid #d8d8d8;
            text-align: center;
            line-height: 25px;
            font-size: 12px;
            color: #606266;
            border-radius: 5px;
            margin-right: 10px;
        }

        .outer-li-alone input {
            width: 100%;
            height: 99%;
            border: none;
            opacity: 0;
        }

        .label-explain {
            width: 100%;
        }

        .label-explain-title {
            width: 50px;
            float: left;
            margin-top: 10px;
        }

        .label-explain-content {
            width: 90%;
            float: left;
        }

        .label-explain-content .span {
            color: #7c6fab;
            background-color: #e2e7ff;
            border: 1px solid #d8d8d8;
            padding: 1px 10px;
            border-radius: 50px;
            display: inline-block;
            margin-top: 10px;
            margin-left: 5px;
        }

        .label-explain-content span img {
            margin-left: 5px;
            cursor: pointer;
        }

        .calendar-bg {
            background: url(../../../static/images/calendar.png) no-repeat 23px center;
        }
        .navbar-brand img{
        display: block;
          height: 26px;
      }
      .navbar-brand i{
          display: block;
          font-family: 黑体;
          font-size: 14px;
          letter-spacing: 17px;
          color: #fff;
      }
    </style>

</head>

<body class="dashboard">
<div id="top-nav" class="navbar navbar-xs navbar-inverse navbar-fixed-top">
    <div class="mian-width">
        <div class="navbar-header">
            <a class="navbar-brand" href="/index"><img src="../../../static/images/icon.png"
                                                       style="margin-right: 5px"/><i>优化师加速器</i></a>
        </div>
        <div class="navbar-collapse collapse" id="login_ul">
            <ul class="nav navbar-nav pull-right" id="loginUl" style="display: block;">
                <li class="dropdown g-theme">
                    <a class="btn-login" id="btnLogin">
                        登录
                    </a>

                </li>
                <li class="dropdown g-theme">
                    <a class="btn-login btn-register" id="btnRegister" style="margin-right: 10px;">
                        注册
                    </a>

                </li>

            </ul>

            <ul class="nav navbar-nav pull-right" style="display:none;position: relative;margin-right: 8px;"
                id="userList">
                <li class="dropdown user-information" style="cursor:pointer;margin-top: 15px">
                    <img src="../../../static/images/head.png" style="width: 30px;height: 30px;" id="show_list"/>
                    <img class="vip-ico" src="../../../static/images/vip.png" alt="">
                    <div class="user-color" id="company_name"></div>
                </li>
                <ul style="display:none;position: absolute;padding: 0;background-color: #fff;max-height: 300px;border: 1px solid #f5f7fa;border-radius: 5px;-moz-box-shadow:2px 2px 13px #919191; -webkit-box-shadow:2px 2px 13px #919191; box-shadow:2px 2px 13px #919191;overflow-y: auto;z-index: 100;color: #606266;width: 150px;text-align: center;left:-46px;top:65px;"
                    id="buttonList">
                    <li style="line-height: 40px;height: 40px;font-size: 14px;">
                        <a style="display: block;cursor:pointer;" id="user_page">
                            <img src="../../../static/images/YHXX.png"/>
                            用户信息
                        </a>
                    </li>
                    <li style="line-height: 40px;height: 40px;font-size: 14px;">
                        <a style="display: block;cursor:pointer;" id="collect_page">
                            <img src="../../../static/images/sc.png"/>
                            收藏列表
                        </a>
                    </li>
                     <li style="line-height: 40px;height: 40px;font-size: 14px;">
                        <a style="display: block;cursor:pointer;" id="order_page">
                            <img src="../../../static/images/order.png"/>
                            充值记录
                        </a>
                    </li>
                    <li style="line-height: 40px;height: 40px;font-size: 14px;cursor:pointer;" id="out">
                        <a style="display: block;">
                            <img src="../../../static/images/TCDL.png"/>
                            退出登录
                        </a>
                    </li>
                </ul>

            </ul>
            <ul class="nav navbar-nav pull-right" style="display: block;">
                <li class="dropdown g-theme">
                    <a href="/purchase_page" target="_blank" class="btn-login set-meal">
                        价格套餐
                    </a>

                </li>
            </ul>
            <ul class="nav navbar-nav pull-right" style="display: block;">
                <li class="dropdown g-theme">
                    <a href="/product_introduction" target="_blank" class="btn-login set-meal">
                        产品介绍
                    </a>

                </li>
            </ul>
            <ul class="nav navbar-nav pull-right" style="display: block;">
                <li class="dropdown g-theme">
                    <a href="/show_ad_school" target="_blank" class="btn-login set-meal">
                        知识学院
                    </a>

                </li>
            </ul>

        </div>
    </div>
</div>
<style type="text/css">
    .body-content-left {
        width: 20%;
        float: left;
        border: 1px solid #d4d4d4;
        height: 600px;
        border-radius: 5px;
        background-color: #fff;
    }

    .body-content-right {
        width: 70%;
        float: right;
    }

    .bookmark-tltie {
        height: 60px;
        line-height: 60px;
        text-align: center;
        border-bottom: 1px solid #D4D4D4;
        color: #070101;
    }

    .bookmark-tltie span {
        margin-left: 10px;
    }

    .bookmark-list {
        width: 90%;
        margin: 25px auto 0;
        background-color: #ededed;
    }

    .bookmark-list li {
        height: 35px;
        line-height: 35px;
        text-align: center;
    }

    .collect-tltie {
        width: 100%;
        border: 1px solid #D4D4D4;
        border-radius: 5px;
        height: 70px;
        line-height: 70px;
        padding-left: 30px;
        background-color: #fff;
    }

    .content-middle-ul {
        width: 110%;
        margin-top: 20px;
    }
</style>
<!--中间-->
<div class="body-content">
    <div class="body-content-left">
        <div class="bookmark-tltie">书签列表<span>(1)</span></div>
        <ul class="bookmark-list">
            <li>最爱</li>
        </ul>
    </div>
    <div class="body-content-right">
        <div class="collect-tltie">
            最爱
        </div>

        <div class="content-middle-ul" id="list-ul">

        </div>
    </div>
</div>
<script type="text/javascript" src="../../../static/js/jquery.freetile.min.js"></script>


<div class="auth-body-warp-register" style="display: none;">
    <div class="auth-body">
        <div class="body-middle">
            <form action="" method="post">
                <div class="panel panel-default panel-single" id="panel-login">
                    <img src="../../../static/images/colse2.png" class="close-img" id="login-close-register"/>
                    <input type='hidden' name='csrfmiddlewaretoken'
                           value='agySyUF4evwylcfFpPLW10mZq9mxcXSHTFvhDWC8MFX4Jz5PstFnaspo1nskGfl0'/>

                    <div class="panel-heading">

                        <p style="text-align: center;margin-top: 15px">
                            <img src="../../../static/images/logo.png"/>
                        </p>

                    </div>
                    <div class="panel-body">

                        <div id="div_id_username" class="row">
                            <div class="controls clearfix">
                                <div class="input-group input-group-lg">
                                    <span class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
                                    <input class="form-control input-lg" maxlength="254" name="username" type="text"
                                           placeholder="企业名称">
                                </div>

                            </div>
                        </div>
                        <div class="row">
                            <div class="controls clearfix">
                                <div class="input-group input-group-lg">
                                    <span class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
                                    <input class="form-control input-lg" maxlength="254" name="username" type="text"
                                           placeholder="负责人">
                                </div>

                            </div>
                        </div>
                        <div class="row">
                            <div class="controls clearfix">
                                <div class="input-group input-group-lg">
                                    <span class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
                                    <input class="form-control input-lg" maxlength="254" name="username" type="text"
                                           placeholder="手机号">
                                </div>

                            </div>
                        </div>


                        <div id="div_id_password" class="row">
                            <div class="controls clearfix">
                                <div class="input-group input-group-lg">
                                    <span class="input-group-addon"><i class="fa fa-lock fa-fw"></i></span>
                                    <input class="form-control input-lg" name="password" type="password"
                                           placeholder="密码">
                                    <input type="text" value="获取验证码"
                                           style="position: absolute;height: 43px;padding: 10px 0px;width: 90px;font-size: 14px;text-align: center;left: 198px;top:1px;cursor:pointer;"
                                           readonly=""/>
                                </div>

                            </div>
                        </div>

                        <input type="hidden" name="this_is_the_login_form" value="1"/>
                        <input type="hidden" name="next" value="/admin/"/>

                        <button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>

                        <div class="text-info" style="margin-top:15px;">
                            <a href="javasrcipt:;"><i class="fa fa-question-sign"></i> 忘记了您的密码或用户名？</a>
                        </div>
                    </div>

                </div>
            </form>
        </div>
    </div>
</div>

<div class="auth-body-warp">
    <div class="auth-body">
        <div class="body-middle">
            <div class="logo-img-parent">
                <img src="../../../static/images/logo.png"/>
            </div>

            <div class="mian-bg-wf">
                <img src="../../../static/images/GB.png" class="mian-bg-wf-close" id="close_btn"/>
                <div id="jsRegister" class="mian-bg-wf-top">
                    <div class="tacitly-style left-top-radius20 pitch-bg" id="change_login">登录</div>
                    <div class="tacitly-style right-top-radius20" id="change_register">注册</div>
                </div>

                <form class="login-index-form" id="login-index" style="display: block;">
                    <div class="login-index-fd">
                        <i class="person-phone"></i>
                        <input type="text" placeholder="手机号码" class="focus-input-border login-index-fd-input"
                               id="personagePhone"/>
                        <sapn class="login-index-fd-span">输入手机号码</sapn>
                    </div>
                    <div class="login-index-fd">
                        <i class="person-lock"></i>
                        <input type="text" placeholder="验证码" class="focus-input-border login-index-fd-input"
                               id="personageCode"/>
                        <sapn class="login-index-fd-span">输入验证码</sapn>
                        <input type="text" value="获取验证码" readonly="" id="gainCode" class="login-index-fd-input-code"/>
                    </div>
                    <div class="login-button" id="loginButton">登录</div>
                </form>

                <form style="display: none;" id="register-index" class="login-index-form">
                    <div class="login-index-fd">
                        <i class="company-name"></i>
                        <input type="text" placeholder="公司名称" class="focus-input-border login-index-fd-input"
                               id="registerCompanyName"/>
                        <sapn class="login-index-fd-span">输入公司名称</sapn>
                    </div>
                    <div class="login-index-fd">
                        <i class="person-head-img"></i>
                        <input type="text" placeholder="姓名" class="focus-input-border login-index-fd-input"
                               id="registerName"/>
                        <sapn class="login-index-fd-span">输入姓名</sapn>
                    </div>
                    <div class="login-index-fd">
                        <i class="person-phone"></i>
                        <input type="text" placeholder="手机号码" class="focus-input-border login-index-fd-input"
                               id="registerPhone"/>
                        <sapn class="login-index-fd-span">输入手机号码</sapn>
                    </div>
                    <div class="login-index-fd">
                        <i class="person-lock"></i>
                        <input type="text" placeholder="验证码" class="focus-input-border login-index-fd-input"
                               id="registerCode"/>
                        <sapn class="login-index-fd-span" id="input_code">输入验证码</sapn>
                        <input type="text" value="获取验证码" class="login-index-fd-input-code" readonly=""
                               id="register_gainCode"/>
                    </div>
                    <div class="login-button" id="registerButton">注册</div>
                    <div class="policy-div">注册即表示您同意 <a href="/agreement_page" target="_blank">服务条款</a> 和 <a
                            href="/privacy" target="_blank">隐私政策</a>。
                    </div>
                </form>
            </div>

        </div>
    </div>
</div>


</body>
<script type="text/javascript" src="../../../static/js/base64.js"></script>
<script type="text/javascript" src="../../../static/js/top-common.js"></script>
<script>


    $(function () {
        if (getCookie("tooken") != "") {
            var token_split = getCookie("tooken").split('.')
            var payload = token_split[1]
            {#var base64 = new Base64();#}
            var str = Base64.decode(payload);
            {#console.log(typeof str);#}
            {#console.log(JSON.stringify(str))#}
            var str1 = unescape(str.replace(/\\u/g, '%u'))
            {#console.log(str1);#}
            var obj = JSON.parse(str1);
            id = obj.user_id
            $('#company_name').html(obj.company_name);
        } else {
            window.location.href = '/error'
            return
        }

        $.ajax({
            url: '/user_collection',
            type: 'get',
            data: {
                id: id
            },
            success: function (data) {
                if (data.json_data != null) {

                    for (i = 0; i < data.json_data.length; i++) {

                       var text = '<div class="single-page">\
		          		<div class="collect-button">\
							<span class="span-right" id="spanRight">\
								<div class="a-button"><a onclick="jumpad(\'' + data.json_data[i].url + '\');">详&nbsp情</a></div>\
								<div class="more a-button" id=' + data.json_data[i].id + '><a >更&nbsp多</a></div>\
								<img src="../../../static/images/x2.png" data-id=' + data.json_data[i].id + ' class="heat-img" id="heatImg" style="width: 25px;height: 25px;"/ >\
							</span>\
						</div>\
						<hr />\
			            <div class="li-titel">\
			              <img src=' + data.json_data[i].logo + ' class="head-logo" / >\
			              <span class="fw700 c3 fs16 padding-left05">' + data.json_data[i].app_name + '</span>\
			            </div>\
			            <a >\
			            	<div class="head-content fs14">' + data.json_data[i].title + '</div>\
				            <div class="mian-img-div">\
				            	<img src="' + '/images/'+data.json_data[i].app_id+'/'+data.json_data[i].local_img + '" class="mian-img"/>\
				            </div>\
			            </a>\
			            <div class="li-heat head-content">\
			            	<span><img src="../../../static/images/1.png" class="heat-img"/ > ' + data.json_data[i].discover_day_time + '</span>\
			            	<span><img src="../../../static/images/2.png" class="heat-img"/ > ' + data.json_data[i].read_count + '</span>\
			            	<span><img src="../../../static/images/3.png" class="heat-img"/ > ' + data.json_data[i].share_count + '</span>\
			            </div>\
					</div>';
                        $("#list-ul").append(text);
                    }

                    $("#list-ul").freetile({animate: true, elementDelay: 0});

                } else {

                }

            }
        })

    })


    $(document).on("click", function (e) {

        $('#buttonList').slideUp();

    })

    //点击跳转更多页面
    $(document).on("click", ".more", function () {
        if (get_payLoad() == null) {
            alert("请先登录或注册！");
            $(".auth-body-warp").show();
            return
        }
        title = $(this).parent($("span")).parent("div").parent("div").children("a")[0].innerText
        id = $(this).attr('id')

        window.open("/index_details?id=" + id);
    })


    //点击收藏响应事件
    $(document).on("click", "#heatImg", function () {

        if (getCookie("tooken") == "" || getCookie("tooken") == "null") {
            alert("请先登录或注册")
            $(".auth-body-warp").show();
            return
        }

        var imgUrl = '../../../static/images/x1.png';
        var newImgUrl = $(this).attr("src");
        console.log(newImgUrl)
        if (imgUrl == newImgUrl) {
            alert("执行了")//收藏
            id = $(this).attr("data-id");
            $.ajax({
                url: '/collect/',
                type: 'post',
                dataType: "json",
                data: {
                    id: id,
                },
                success: function (data) {

                    var collected = "collected"
                    if (data.json_data != collected) {
                    }
                }

            })

            $(this).attr("src", "../../../static/images/x2.png");
        } else {        //取消收藏

            aid = $(this).attr("data-id");
            alert(aid)
            $.ajax({
                url: '/collect/',
                type: 'post',
                dataType: "json",
                data: {
                    id: aid,
                },
                success: function (data) {
                    var deleted = "deleted"
                    if (data.json_data != deleted) {
                        alert("error")
                    }
                }

            })
            refresh_page()
        }
    })

</script>
</html>